.page {
  width: 100vw;
  height: 100vh;
}

.music {
  position: fixed;
  top: 5%;
  right: 5%;
  z-index: 999;
}

.music img {
  width: 40px;
  height: 40px;
}

#home {
  filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray
}

#home {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -10;

  background: url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1601011410254&di=57c257812e7ee08de03675c0d7b8dfb0&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201802%2F12%2F20180212112358_2cuwy.jpeg') no-repeat center center;
}
#home h1 {
  background: url('../img/home.png') no-repeat center center;
}

#dtxz {
  display: none;
}

#dtxz ul {
  display: grid;
  grid-template-columns: repeat(2,50%);
  grid-template-rows: 20% repeat(3,26.666%);
  justify-items: center;
  align-items: center;
  background: url('https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3931769196,27343833&fm=26&gp=0.jpg') no-repeat center center;
  background-size: cover;
}

#dtxz ul li {
  width: 0;
  height: 0;
  padding: 8vh;
  position: relative;
  background: url('../img/塔.png') no-repeat center center;
}

#dtxz ul li span {
  position: absolute;
  width: 20px;
  top: 0;
  background-color: #fff;
  text-align: center;
}

#dtxz ul li.left span {
  left: 0px;
}

#dtxz ul li.right span {
  right: -0.4rem;
}

#dtxz ul h2.item-1 {
  grid-column-start: span 2;
  font-size: 1rem;
}